<template>
  <!--加入我们-->
  <div class="join_us1">
    <div class="join_box">
      <img src="@/assets/image/index/joinUs.png" alt="">
      <div class="join_us_text1">
        <div class="top1_text">{{ $t('携手同行，开启成功之路') }}</div>
        <div class="intro_text">{{ $t('入驻即赚，开拓新商机，与我们合作，轻松实现利润倍增，开启财富新篇章！') }}</div>
        <div class="jr_btn2" @click="merchantJump">{{ $t('加入我们') }} →</div>
      </div>
    </div>
  </div>
</template>

<script>
import {mapGetters} from "vuex";

export default {
  name: "VJoinUs",
  data() {
    return {}
  },
  computed: {
    ...mapGetters({
      userInfo: "userInfo"
    }),
  },
  methods: {
    merchantJump(){
      // if (this.userInfo?.roletype != 1) {
      //   // 商家入驻
      //   let lang = localStorage.getItem("lang") || "en";
      //   lang = lang.replace(/"/g, "");
      //   let path = window?.plus ? this.paths[this.itemName] : location.origin + '/'
      //   const url = `${path}promote/#/?lang=${lang}&avatar=${this.userInfo?.avatar || 1}`
      //   if (window.plus) {
      //     plus.runtime.openURL(url)
      //   } else {
      //     window.location.href = url
      //     // this.$router.push('/merchantSettled')
      //   }
      // } else {
      //   // 商家登陆
      //   let token = localStorage.getItem("token");
      //   let lang = localStorage.getItem("lang") || "en";
      //   let path = window?.plus ? this.paths[this.itemName] : location.origin + '/'
      //   window.location.href = `${path}www/#/?from=shop&token=${token}&lang=${lang}`
      // }
      this.$router.push('/merchantSettled')
    },
  }
}
</script>

<style scoped lang="scss">
.join_us1{
  padding: 0 15px;
  margin-bottom: 60px;
  .join_box{
    position: relative;
    height: 330px;
    width: 100%;
    &::before{
      position: absolute;
      content: "";
      width: 100%;
      height: 100%;
      background: #000000;
      opacity: .4;
      top: 0;
      left: 0;
      z-index: 9;
      pointer-events: none;
    }
    >img{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .join_us_text1{
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      z-index: 9;
      padding: 0 30px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      color: #fcfcfc;
      .top1_text{
        font-size: 22px;
        font-weight: bold;
        color: #fff;
      }
      .intro_text{
        margin-top: 15px;
        font-size: 14px;
        text-align: center;
      }
      .jr_btn2{
        margin-top: 15px;
        padding: 8px 15px;
        background: #d62014;
        font-size: 14px;
        border-radius: 4px;
      }
    }
  }
}
</style>
